<template>
  <!-- 页脚：第一版 -->
  <div class="foot">
    <div class="container">
      <div class="foot-top">
        <ul>
          <li>
            <a href="">关于我们</a>
          </li>
          <li>
            <a href="">招贤纳士</a>
          </li>
          <li>
            <a href="">商务合作</a>
          </li>
          <li>
            <a href="">寻求报道</a>
          </li>
          <li>
            <i class="el-icon-phone"></i>
            <span>400-660-0108</span>
          </li>
          <li>
            <i class="el-icon-s-promotion"></i>
            <span>kefu@csdn.net</span>
          </li>
          <li>
            <i class="el-icon-time"></i>
            <span>工作时间 9:00-18:00</span>
          </li>
        </ul>
      </div>
      <div class="foot-botton">
        <ul>
          <li>
            <a href="">公安备案号11010502030143</a>
          </li>
          <li>
            <a href="">京ICP备19004658号</a>
          </li>
          <li>
            <a href="">京网文〔2020〕1039-165号</a>
          </li>
          <li>
            <a href="">经营性网站备案信息</a>
          </li>

          <li>
            <a href="">©1999-2022北京创新乐知网络技术有限公司</a>
          </li>

          <li>
            <a href="">版权与免责声明</a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Foot'
}
</script>

<style lang="less" scoped>
.foot {
  background: #fff;
  min-width: 972px;
  box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.05);
  display: flex;
  padding: 24px 34px 20px;
  .foot-top {
    ul {
      display: flex;
      justify-content: center;
    }
    li {
      margin: 0 8px;
      color: #999aaa;
      font-size: 14px;
      height: 16px;
      line-height: 16px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      i {
        margin-right: 4px;
      }
    }
  }
  .foot-botton {
    padding-top: 8px;
    ul {
      margin-top: 8px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
    li {
      font-size: 12px;
      color: #999aaa;
      height: 16px;
      line-height: 16px;
      margin: 4px 6px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
    }
  }
}
</style>
